;(function($)
{
	$(document).ready(function() 
	{

		// Here all containers are prepared, except for those that hold images.
		// Elements are added to the containers at this stage.
		// First test
		for (i=0;i<40;i++) 
		{
			var w = 64 * (parseInt(Math.random() * 3) + 1) - 1,
				h = 48 * (parseInt(Math.random() * 3) + 1) - 1;
			// $('<div class="element" style="color:#fff;"></div>').width(w).height(h).appendTo('.first.test');
		}
		// Make sure the "empty" test is actually empty and call freetile on it.
		$( '.empty.test' ).empty();
        $( '.empty.test' ).freetile(
        {
            callback: function() { $( '.empty.test' ).text( 'Callback from empty container.' ); }
        });

        // Call the testpack function on all non-image containers.
		$('#freetile-demo').children('div').first().each(function()
		{
			$(this).testpack();
		});

	});

	// "testpack" is the main testing function that sequentially calls
	// freetile on every container (using the callback function of the previous
	// freetile instance).
	// If there are no more containers, it calls "testimages", a similar function
	// responsible for testing image containers (below).
	$.fn.testpack = function() 
	{
		var $this = $(this);
		var start = new Date();
		$this.freetile(
		{
			animate: true,
			elementDelay: 10,
			callback: function() 
			{
				var time = new Date() - start,
					prev = $this.prevAll('h4').first();
				prev.html(prev.html() + " (" + time + "ms)");
				var nxt = $this.nextAll('div:not(.images)').first();
				if (nxt.length)
				{
					nxt.testpack();
				}
				else
				{
					// $('.images.test').first().testimages();
				}
			}
		});
	}

})(jQuery)



